Ext.onReady(function(){

    // create the data store
    var store = new Ext.data.JsonStore({	
		totalProperty: 'total',	// total data, see json output
		root: 'root',	// see json output	
		url: 'data.php', 			
        fields: [
            {name: 'date'},
           {name: 'pageview', type: 'float'},
           {name: 'ip', type: 'float'},
           {name: 'visits', type: 'float'},
           {name: 'uv', type: 'float'},
		   {name: 'pvuv', type: 'float'},
		   {name: 'op', type: 'string'}
        ]
    });	    

	// load data from the url ( data.php ) and add start and limit parameter
	store.load({params:{start: 0, limit: 8}});

    // create the Grid
    var grid = new Ext.grid.GridPanel({
        store: store,
        columns: [
            new Ext.grid.RowNumberer(),
    				    {header:"日期",sortable:false,resizable:true,dataIndex:"date",menuDisabled:true,align: "center"
    					},
    					{header:"Page View",sortable:false,resizable:true,menuDisabled:true,dataIndex:"pageview"
    					},
    					{header:"IP",sortable:false,resizable:true,menuDisabled:true,dataIndex:"ip"
    					},
    					{header:"Visits",sortable:false,resizable:true,menuDisabled:true,dataIndex:"visits"
    					},
    					{header:"UV",sortable:false,resizable:true,menuDisabled:true,dataIndex:"uv"
    					},
						{header:"PV/UV",sortable:false,resizable:true,menuDisabled:true,dataIndex:"pvuv"
    					},
						{header:"操作",sortable:false,resizable:true,menuDisabled:true,dataIndex:"op"
    					}
        ],
        stripeRows: true,
        height:250,
        width:800,
        title:'Paging Grid',
		
		bbar: new Ext.PagingToolbar({
			pageSize: 8,	// data to display
			store: store,
			displayInfo: true,
			displayMsg: 'Displaying topics {0} - {1} of {2}',
			emptyMsg: "No topics to display"			
		})
    });

	// render this grid to paging-grid element
    grid.render('paging-grid');
		
});